<!--------------------------------------------------------------
>//	Company:	HTHK
>//	NAME:	    ProjectGroupExport.jsp
>//	TITLE:	    Project Group Report
>//	FUNCTION:	Project Group Report
>//	BY:	        Teng Yang
>//	DATE:	    21/10/2013
>// --------------------------------------------------------------
-->

<%@ include file="../tssheader.jsp"%>
<%@ page import="tss.options.*"%>
<%
	ProjectGroupExportOptions groupOptions = new ProjectGroupExportOptions();
%>

<script language="JavaScript1.1">
	
	
	function exportExcel()
	{
	    if (!checkDate())
		{
	    	alert("Please input a valid date.");
			return false;
		}
	    var rightOptions = document.getElementById("selectedProjects");
	    if(rightOptions.children.length == 0){
	    	alert("Please select one project group at least.");
	    	return false;
	    }
	    
	    var rightOptions = document.getElementById("selectedProjects");
	    for(var i = 0;i < rightOptions.children.length;i++){
	    	rightOptions.children[i].selected = true;
		}
	    
	    fm.submit();
	}
	function checkDate() {
		var dateStr = document.getElementById("month").value; 
		var datePat = /^(\d{4})(\d{2})$/;
		var matchArray = dateStr.match(datePat);

		if (matchArray == null) {
			return false;
		}
		month = matchArray[2];
		year = matchArray[1];
		if (month < 1 || month > 12) {
			return false;
		}

		return true;
	}
	function moveToRight(){
		var leftOptions = document.getElementById("leftProjects");
		var rightOptions = document.getElementById("selectedProjects");
		var leftChildren = leftOptions.children;
		var array = new Array();
		for(var i = 0;i < leftChildren.length;i++){
			var tempChild = leftChildren[i];
			if(tempChild.selected == true){
				array.push(tempChild);
			}
		}
		for(var item in array){
			array[item].selected = false;
			leftOptions.removeChild(array[item]);
			rightOptions.appendChild(array[item]); 
		}
	}
	
	function moveToLeft(){
		var leftOptions = document.getElementById("leftProjects");
		var rightOptions = document.getElementById("selectedProjects");
		var rightChildren = rightOptions.children;
		var array = new Array();
		for(var i = 0;i < rightChildren.length;i++){
			var tempChild = rightChildren[i];
			if(tempChild.selected == true){
				array.push(tempChild);
			}
		}
		for(var item in array){
			array[item].selected = false;
			rightOptions.removeChild(array[item]);
			leftOptions.appendChild(array[item]); 
		}
	}
	function moveUp(){
		var obj = document.getElementById("selectedProjects"); 
		for(var i = 1; i < obj.length; i++){
			if(obj.options[i].selected){  
				var selText = obj.options[i].text;
				var selValue = obj.options[i].value;
				obj.options[i].text = obj.options[i-1].text;
				obj.options[i].value = obj.options[i-1].value;
				obj.options[i].selected = false;
				obj.options[i-1].text = selText;
				obj.options[i-1].value = selValue;
				obj.options[i-1].selected=true;
			}
		}
	}
	function moveDown(){
		var obj = document.getElementById("selectedProjects");
		for(var i = obj.length - 2; i >= 0; i--){
			if(obj.options[i].selected){
				if(!obj.options[i+1].selected){
					var selText = obj.options[i].text;
					var selValue = obj.options[i].value;
					obj.options[i].text = obj.options[i+1].text;
					obj.options[i].value = obj.options[i+1].value;
					obj.options[i].selected = false;
					obj.options[i+1].text = selText;
					obj.options[i+1].value = selValue;
					obj.options[i+1].selected=true;
				}
			}
		}
	}
</script>
<body>
	<h2>Project Group Report</h2>
	<form id=fm method=post action='<%=contextPath%>/servlet/tss.projectgroupreport.ProjectGroupReportSearch'>
		<table>
			<tr>
				<td>Month:</td>
				<td><input id="month" name="month" type="text"
					style="width: 152px; margin-left: 3px;" />&nbsp;&nbsp;e.g. 201310</td>
			</tr>
			<tr>
				<td>Groups:</td>
				<td>
					<table>
						<tr>
							<td><select ondblclick="moveToRight()" multiple="multiple"
								id="leftProjects" style="height: 200px; width: 152px;">
									<%=groupOptions.getLeftOptions()%>
							</select></td>
							<td>&nbsp;<input type="button" value="&gt;&gt;"
								onclick="moveToRight()" />&nbsp;<br /> <br /> &nbsp;<input
								type="button" value="&lt;&lt;" onclick="moveToLeft()" />&nbsp;
							</td>
							<td><select ondblclick="moveToLeft()" multiple="multiple"
								id="selectedProjects" name="selectedProjects"
								style="height: 200px; width: 152px;">
									<%=groupOptions.getRightOptions()%>
							</select></td>
							<td><input type="button" value="Up" style="width: 55px;"
								onclick="moveUp()" /><br />
							<br />
							<input onclick="moveDown()" type="button" value="Down"
								style="width: 55px;" /></td>
						</tr>
					</table>
				</td>
			</tr>
		</table>
		<br>
		<hr>
		<p>
			<INPUT type=button value='Export' onclick="exportExcel()"> <INPUT
				type=reset value='Cancel'>
		</p>
	</form>
	<%@ include file="../tssfooter.jsp"%>
</body>
</html>
